﻿<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>计算属性</title>
	</head>
	<body>
		<div id="app">
		  <p>原始字符串: {{ message }}</p>
		  <p>计算后的反转字符串: {{ reversedMessage }}</p>
		</div>
	
		<script src="https://unpkg.com/vue@next"></script>
        <script>
        	const vm = Vue.createApp({
        	  data() {
        	    return {
        	        message: 'Hello，Java无难事!'
        	    }
        	  },
        	  computed: {
        	  	// 计算属性的 getter
        	    reversedMessage(){
        	      return this.message.split('').reverse().join('');
        	    }
        	  }
        	}).mount('#app');
        </script>
	</body>
</html>